<script setup lang="ts">
/**
 * 如果使用AConfigProvider修改了主题色
 * 该组件只能在AConfigProvider之内
 * */
import { theme } from "ant-design-vue";

defineOptions({ name:"WebxLayoutRoot" });

// 获取ant-design-vue内置主题
const { token } = theme.useToken();
</script>

<template>
  <div class="webx-layout-root">
    <slot />
  </div>
</template>

<style lang="less" scoped>
.webx-layout-root{
  // 主题背景
  :deep(.x-bg-primary){ background-color: v-bind("token.colorPrimary"); }
  // 菜单背景
  :deep(.x-bg-primary-1){ background-color: v-bind("token.colorPrimaryBg"); color: v-bind("token.colorPrimary"); }
  // 项鼠标移入
  :deep(.x-item:hover){ background-color: v-bind("token.colorFillContent"); }
}
</style>